<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <!-- 引入 Bootstrap.min.css 文件 -->
    <link
      rel="stylesheet"
      href="/public/lib/bootstrap-3.4.1-dist/css/bootstrap.min.css"
    />
    <!-- 引入 app.css 文件 -->
    <link rel="stylesheet" href="/public/css/app.css" />
  </head>
  <body>
    <div class="main">
      <h1>Example page header <small>Subtext for header</small></h1>

      <!-- Indicates a successful or positive action -->
      <a href="/post"
        ><button type="button" class="btn btn-success">发表留言</button></a
      >

      <div class="message-ul">
        <ul>
          <!-- 渲染评论  引擎模板-->
          {{each comments}}
          <li>
            <h4 class="title">{{ $value.title }}</h4>
            <p class="message-content">{{ $value.message }}</p>

            <div class="li-bottom">
              <span class="glyphicon glyphicon-user user-icon"></span>
              <a href="#" class="user">{{ $value.name }}</a>
              <span class="glyphicon glyphicon-time dateTime-icon"></span>
              <a href="#" class="dateTime">{{ $value.dateTime }}</a>
            </div>
          </li>
          {{/each}}

          <!-- 渲染评论  引擎模板-->
          {{each comment}}
          <li>
            <h4 class="title">{{ $value.title }}</h4>
            <p class="message-content">{{ $value.message }}</p>

            <div class="li-bottom">
              <span class="glyphicon glyphicon-user user-icon"></span>
              <a href="#" class="user">{{ $value.user }}</a>
              <span class="glyphicon glyphicon-time dateTime-icon"></span>
              <a href="#" class="dateTime">{{ $value.dateTime }}</a>
            </div>
          </li>
          {{/each}}

          <!-- 渲染评论  引擎模板-->
          {{each comment}}
          <li>
            <h4 class="title">{{ $value.title }}</h4>
            <p class="message-content">{{ $value.message }}</p>

            <div class="li-bottom">
              <span class="glyphicon glyphicon-user user-icon"></span>
              <a href="#" class="user">{{ $value.user }}</a>
              <span class="glyphicon glyphicon-time dateTime-icon"></span>
              <a href="#" class="dateTime">{{ $value.dateTime }}</a>
            </div>
          </li>
          {{/each}}
        </ul>
      </div>
    </div>
  </body>
</html>
